﻿<html DOCTYPE>
<head>
	
</head>


<div id="header">这是测试div</div>
<h1>这个不会有变化</h1>
<h2>hello world</h2>
<div id="roundHead">这是一个测试的圆边头</div>
<div id="roundFoot">这是一个测试的圆边脚</div>
<pre>这是为什么的呢？据说这是一个pre标签，有什么用呢，好像会自动换行的话，按样式来的，看看效果再说吧！</pre>

<div id='foheader'>
	Functions & Operation for the less<br>
	这里提出一点，Less中的Operations主要是针对任何数字、颜色、变量的操作，可以对其是行加、减、、乘、除或者更复杂的综合运算；而Functions主要是针对Color funtions，Less提供了多种变换颜色的功能，下面多们来俱体看一下这两个功能的使用。著作权归作者所有。
商业转载请联系作者获得授权,非商业转载请注明出处。
	<pre>
	lighten(@color, 10%);     // return a color which is 10% *lighter* than @color
	darken(@color, 10%);      // return a color which is 10% *darker* than @color
	saturate(@color, 10%);    // return a color 10% *more* saturated than @color
	desaturate(@color, 10%);  // return a color 10% *less* saturated than @color
	
	fadein(@color, 10%);      // return a color 10% *less* transparent than @color
	fadeout(@color, 10%);     // return a color 10% *more* transparent than @color

	spin(@color, 10);         // return a color with a 10 degree larger in hue than @color
	spin(@color, -10);        // return a color with a 10 degree smaller hue than @color					
				
著作权归作者所有。
商业转载请联系作者获得授权,非商业转载请注明出处。
原文: https://www.w3cplus.com/css/less © w3cplus.com
	</pre>
</div>
<div id="cheader">
	简单运算
</div>
<div id="fheader">
 fadein&something others
 <h1><a href="">分层试试</a></h1>
	<p>记述前端好些事——引领Web前沿</p>
</div>
<div id="nheader">
	<h1><a href="">W3cplus</a></h1>
	<p>记述前端好些事——引领Web前沿</p>
</div>
<link rel="stylesheet/less" type="text/css" href="less/hello01.less">
<script src="js/less.min.js" type="text/javascript"></script>
</html>